<include file="public@header"/>
<style type="text/css">
    .pic-list li {
        margin-bottom: 5px;
    }
</style>

<script type="text/html" id="files-item-tpl">
    <li id="saved-file{id}">
        <input id="file-{id}" type="hidden" name="file_url[]" value="{filepath}">
        <input class="form-control" id="file-{id}-name" type="text" value="{name}" style="width: 200px;" title="文件名称">
        <a id="file-{id}-preview" href="{preview_url}" target="_blank">下载</a>
        <a href="javascript:uploadOne('文件上传','#file-{id}','file');">替换</a>
        <a href="javascript:(function(){$('#saved-file{id}').remove();})();">移除</a>
    </li>
</script>
</head>
<body>
<div class="wrap js-check-wrap">
    <ul class="nav nav-tabs">
        <li><a href="{:url('AdminActivity/index')}">活动列表</a></li>
        <li class="active"><a href="{:url('AdminActivity/add')}">添加活动</a></li>
    </ul>
    <form action="{:url('AdminActivity/addPost')}" method="post" class="form-horizontal js-ajax-form margin-top-20" id="form">
        <input type="hidden" name="id" value="{$id|default=''}">
        <div class="row">
            <div class="col-md-9">
                <table class="table table-bordered">

                    <tr>
                        <th>注意事项<span class="form-required">*</span></th>
                        <td>
                            1.在下面，您将看到您申报的所有志愿者活动。您可以申报活动或是申请一个新的活动。</br>
                            2.申报活动前请确认您要申报的人员没有被申报过，系统自动过滤重复申报的人员。
                        </td>

                    </tr>
                    <tr>
                    <th>活动标题<span class="form-required">*</span></th>
                    <td>
                    <input class="form-control" type="text" name="title"
                    id="title" required value="{$data.title|default=''}" placeholder="请输入标题"/>
                    </td>
                    </tr>

                    <tr>
                        <th>报名上限人数（默认为0无限制）<span class="form-required">*</span></th>
                        <td>
                            <input class="form-control" type="number" name="max_people"
                                   id="max" required value="{$data.max_people|default=''}" style="width: 10%"/>
                        </td>
                    </tr>

                    <tr>
                        <th>服务内容<span class="form-required">*</span></th>
                        <td>
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <select name="server_content" >
                                        <option value="0">请选择服务内容</option>
                                        <foreach name="server_content" id="vo">
                                            <option value="{$vo.name}">{$vo.name}</option>
                                        </foreach>
                                    </select>
                                </div>
                            </div>
                        </td>
                    </tr>


                    <tr>
                        <th>活动类型<span class="form-required">*</span></th>
                        <td>
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <select name="activity_type" >
                                        <option value="0">请选择服务内容</option>
                                        <foreach name="activity_type" id="vo">
                                            <option value="{$vo.name}">{$vo.name}</option>
                                        </foreach>
                                    </select>
                                </div>
                            </div>
                        </td>
                    </tr>




                    <tr>
                        <th><b>活动时间</b></th>

                        <td>
                            开始时间：
                            <input class="form-control js-bootstrap-datetime" type="text" name="start_time"
                                   value="{$data.start_time|default=time()|date='Y-m-d H:i:s'}">
                            结束时间：
                            <input class="form-control js-bootstrap-datetime" type="text" name="end_time"
                                   value="{$data.end_time|default=time()|date='Y-m-d H:i:s'}">
                        </td>
                    </tr>

                    <th>选择活动地点</th>
                    <td>

                        <div id="allmap" style="height:400px;width:800px;"></div>
                        <input class="form-control"  style="width: 700px" type="text" name="place" id="place" value="{$vo.place|default=''}">
                        <input  type="hidden" name="location" id="location" value="{$vo.location|default=''}">
                    </td>
                    </tr>
                    <tr>
                        <th>内容</th>
                        <td>
                            <script type="text/plain" id="content" name="content">{$data.content|default=''}</script>
                        </td>
                    </tr>

                    <tr>
                        <th>活动请示事项</th>
                        <td>
                            <script type="text/plain" id="extra" name="extra">{$data.extra|default=''}</script>
                        </td>
                    </tr>

                    <tr>
                        <th>选择模拟参与的志愿者</th>
                        <td height="80px">
                            <div>
                                <table style="width: 700px; float: left;">
                                    <tbody>
                                    <tr height="40px">
                                        <td>
                                            所属大队：
                                            <div class="layui-form-item">
                                                <div class="layui-input-block">
                                                    <select name="big_team" id="big_team" lay-filter="big_team" >
                                                        <foreach name="big_team" id="vo">
                                                        <option value="{$vo.id}">{$vo.name}</option>
                                                        </foreach>
                                                    </select>
                                                </div>
                                            </div>
                                        </td>
                                        <td width="40px"></td>
                                        <td style="width: 300px;">
                                            所属中队：
                                            <select name="mid_team" id="mid_team" style="width:215px;">
                                                <option value="20">一中队</option>
                                            </select>
                                        </td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    </tbody>
                                </table>
                                <table style="width: 700px; float: left;">
                                    <tbody>
                                    <tr>
                                        <td style="width: 192px;">
                                            查询条件：
                                            <input name="query" type="text" id="Query" style="width:180px;">
                                        </td>
                                        <td style="width: 300px; text-align:left;">
                                            &nbsp;&nbsp;&nbsp;&nbsp;<br>

                                            <input type="button" value="开始查询" id="btnQuery" class="am-btn am-btn-danger am-btn-xs" style="width:80px;">
                                        </td>
                                        <td></td>
                                    </tr>
                                    </tbody>
                                </table>
                                <table style="width: 700px; float: left; margin:10px 0 0 0;">
                                    <tbody>
                                    <tr>
                                        <td style="width: 365px">
                                            查询结果：
                                            <select size="4" name="member" id="member" style="height:300px;width:288px;"><option value="100" data-img="/photo/200873184521.jpg">迟钰峰</option><option value="101" data-img="/photo/2008269411.gif">李林</option></select>
                                        </td>
                                        <td style="width: 40px">
                                            <input type="button" name="btnToRight" value=">>" id="btnToRight" class="btn">
                                            <br>
                                            <br>
                                            <input type="button" name="btnToLeft" value="<<" id="btnToLeft" class="btn">
                                        </td>
                                        <td style="width: 250px">
                                            已选人员：
                                            <select size="4" name="member1" multiple="multiple" id="member1" style="height:300px;width:215px;"></select>
                                        </td>
                                        <td style="padding-left: 20px;">
                                            <img id="zp" src="__STATIC__/images/head.png" style="width:114px;height:156px">
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <th>所属组织</th>
                        <td>
                            新训中队
                        </td>
                    </tr>

                </table>
                <hook name="portal_admin_article_edit_view_main"/>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="submit" class="btn btn-primary js-ajax-submit">{:lang('ADD')}</button>
                        <a class="btn btn-default" href="{:url('AdminActivity/index')}">{:lang('BACK')}</a>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <table class="table table-bordered">


                </table>

                <hook name="portal_admin_article_edit_view_right_sidebar"/>
            </div>
        </div>
    </form>

    <select lay-filter="big_team" id="business" class="select" lay-verify="type" name="business">
       <option value="0">请选择</option>
        <option value="1">张三</option>

    </select>

</div>

<script type="text/javascript" src="__STATIC__/js/admin.js"></script>
<script type="text/javascript" src="/html/layui/layui.js"></script>


<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=WQCBZ-FLQCJ-ZKFF5-KTONH-GYQWV-D4BR4"></script>
<script type="text/javascript">
    //编辑器路径定义
    var editorURL = GV.WEB_ROOT;
</script>
<script type="text/javascript" src="__STATIC__/js/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="__STATIC__/js/ueditor/ueditor.all.min.js"></script>
<script type="text/javascript">
    layui.use(['form','layer','jquery'],function(){

        var form = layui.form,
                layer = parent.layer === undefined ? layui.layer : parent.layer,
                $ = layui.jquery;
        var provinceText = "";
        //监听省下拉框

        form.on('select(big_team)', function(dataObj){
            console.log(1)
            //移除城市下拉框所有选项
            $("#mid_team").empty();
            var cityHtml = '<option value="">请选择中队</option>';
            $("#mid_team").html(cityHtml);
            provinceText = $("#big_team").find("option:selected").text();
            var value = $("#big_team").val();
            console.log(value)
            //异步加载下拉框数据

//            $.ajax({
//                type: "post",
//                url: "/portal/index/get_mid_team",
//                data:{"id":value},
//                dataType: "json",
//                success: function(res) {
//                    $html=''
//                    var $html = "";
//                    $.each(res, function (index, item) {
//                        $html += "<option value='" + item.id + "'>" + item.name + "</option>";
//                    });
//                    $("#mid_team").append($html);
//                    //append后必须从新渲染
//                    form.render('select');
//                }
//            });
        });

    });


    (function(){
        "use strict";
        var _map;
        const geo_url = 'https://apis.map.qq.com/ws/geocoder/v1/?output=jsonp&key=U5EBZ-CKTC4-JXBUL-DDOGT-SGHD5-YCFPJ&location=';
        function init_ueditor(){
           var  editorcontent = new baidu.editor.ui.Editor();
            editorcontent.render('content');
            try {
                editorcontent.sync();
            } catch (err) {
            }
        }
        function init_ueditors(){
            var editorcontents = new baidu.editor.ui.Editor();
            editorcontents.render('extra');
            try {
                editorcontents.sync();
            } catch (err) {
            }
        }





    function init_map(){
        _map = new qq.maps.Map(document.getElementById("allmap"), {
            // 地图的中心地理坐标。
            center: new qq.maps.LatLng(35.433327,119.51873),
            zoom: 12,
        });
        qq.maps.event.addListener(_map, 'click', function(e) {
            console.log(e.latLng);
            var _location = e.latLng.lat+','+e.latLng.lng;
            var _query_url = geo_url + _location;
            console.log(_query_url);

            /*
             可优化，加入标注点
             var marker = new qq.maps.Marker({
             position: new qq.maps.LatLng(e.latLng.lat,e.latLng.lng),
             map: _map
             });*/

            $.ajax({
                url:_query_url,
                method:'GET',
                dataType: "jsonp",
                success:function(rsp){

                    if(rsp.status!=0){
                        return alert(rsp.message);
                    }

                    var address = rsp.result.address+rsp.result.formatted_addresses.recommend;
                    $('#place').val(address);
                    $('#location').val(_location);
                    console.log(address)
                    console.log(_location)
                    //build_addr_html(address,_location);
                }
            })
        });
    }
    $(function(){

        init_map();
        init_ueditor()
        init_ueditors()

    })
    })();









</script>
</body>
</html>
